<script lang="ts" setup>
import { Snackbar } from '@varlet/ui'
import router from '../../router'
const goBack = () => {
    router.push('/wode')
  Snackbar({
    // content: '返回',
    position: 'top'
  })
}
</script>
<template>
<var-app-bar title="更换手机号" title-position="center" text-color="black" color="#fff">
    <template #left>
      <var-button
        round
        text
        color="transparent"
        text-color="black"
        @click="goBack"
      >
        <var-icon name="chevron-left" :size="24" />
      </var-button>
    </template>
  </var-app-bar>
    <div>
        <p>为了您的账号安全</p>
        <p>请选择一种方式完成验证</p>
    </div>
    <var-button style="width:90%;margin-left: 5%;">短信</var-button>
    <var-button style="width:90%;margin:20px 5%;">支付密码</var-button>
</template>
<style lang="scss" scoped>
p{
    text-align: center;
}
.var-elevation--3{
  box-shadow: 0 1px 1px -1px !important;
}
</style>